<template>
  <div>
    <el-form :model="formData" label-width="120px" :rules="FormRules" ref="addForm">
      <el-form-item label="采购类型">
        <el-select v-model="formData.type" placeholder="请选择采购类型">
          <el-option label="紧急采购" value="0"></el-option>
          <el-option label="零星采购" value="1"></el-option>
          <el-option label="合同采购" value="2"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="用户">
        <el-select v-model="userSrting" placeholder="请选择用户" @change="selectUser">
          <el-option
            v-for="(item,index) in option"
            :key="index"
            :label="item.account"
            :value="item.account+','+item.cuserid"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="公司部门" prop="pkCorp">
        <companyDepart @getCompanyDepart="getCompanyDepart" :companyDepartData="companyDepartData"></companyDepart>
      </el-form-item>
      <!-- <el-form-item label="公司名称" prop="pkCorp">
        <el-select v-model="formData.pkCorp" placeholder="请选择" @change="companyChange">
          <el-option
            v-for="item in companyList"
            :key="item.pkCorp"
            :label="item.unitname"
            :value="item.pkCorp"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="审批部门">
        <el-select v-model="departString" filterable placeholder="请选择部门">
          <el-option
            v-for="item in departList"
            :key="item.pkDeptdoc"
            :label="item.deptname"
            :value="item.pkDeptdoc+','+item.deptname"
          ></el-option>
        </el-select>
      </el-form-item>-->
      <el-form-item label="是否负责询价">
        <el-select v-model="formData.isInquiry" placeholder="是否负责询价">
          <el-option label="是" value="Y"></el-option>
          <el-option label="否" value="N"></el-option>
        </el-select>
      </el-form-item>
      <!-- <el-form-item label="是否负责汇总">
        <el-select v-model="formData.summary" placeholder="是否负责汇总">
          <el-option label="是" value="Y"></el-option>
          <el-option label="否" value="N"></el-option>
        </el-select>
      </el-form-item> -->
      <el-form-item label="排序" prop="sort">
        <el-input type="number" v-model="formData.sort" placeholder="请输入公司排序的数字"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="handSave()">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import {
  approvalAdd,
  approvalEdit,
  userList,
  omJobSelectBdDeptdoc,
  omJobSelectBdCorp
} from "../../../api/baseSetting";
import companyDepart from "../../components/companyDepart";
export default {
  components: {
    companyDepart
  },
  data() {
    var checkSort = (rule, value, callback) => {
      if (!value) {
        return callback(new Error("请输入排序"));
      }
      if (!Number.isInteger(value * 1)) {
        callback(new Error("请输入数字值"));
      } else {
        callback();
      }
    };
    return {
      userSrting: "", //选中用户的字符串信息
      companyDepartData:[],//传给公司部门的参数
      formData: {
        id: "",
        type: "",
        sort: "",
        isInquiry: "",
        psnname: "",
        cuserid: "",

        groupId: "",
        groupName: "",
        corpTypeId: "",
        corpTypeName: "",
        unitname: "",
        pkCorp: "",
        pkDeptdoc: "",
        deptname: "",
        // summary:'',//是否负责汇总
      },
      departString: "", //选中的部门参数
      FormRules: {
        type: [{ required: true, message: "请选择采购类型", trigger: "blur" }],
        cuserid: [{ required: true, message: "请选择用户", trigger: "blur" }],
        // pkCorp:[{
        //   required: true, message: "请选择公司", trigger: "blur"
        // }],
        isInquiry: [
          { required: true, message: "请选择是否询价", trigger: "blur" }
        ],
        // summary:[
        //   { required: true, message: "请选择是否汇总", trigger: "blur" }
        // ],
        sort: [{ validator: checkSort, trigger: "blur" }]
      },
      companyList: [], //公司列表
      option: [], //员工列表
      departList: [], //部门列表
      departArr: [] //选中的部门
    };
  },
  props: {
    sendFormData: {
      num: {
        type: Object
      }
    }
  },
  methods: {
    //选中用户
    selectUser(e) {
      console.log(e);
      let arr = e.split(",");
      this.formData.psnname = arr[0];
      this.formData.cuserid = arr[1];
    },
    //选中公司部门
    getCompanyDepart(e) {
      console.log(e);
      this.formData.groupId = e[0].value;
      this.formData.groupName = e[0].label;

      this.formData.corpTypeId = e[1].value;
      this.formData.corpTypeName = e[1].label;
      //公司
      this.formData.unitname = e[2].label;
      this.formData.pkCorp = e[2].value;
      //部门
      this.formData.pkDeptdoc = e[3].pkDeptdoc;
      this.formData.deptname = e[3].deptname;
    },
    //获取公司列表
    getCompany() {
      omJobSelectBdCorp({}).then(res => {
        this.companyList = res;
      });
    },
    //选择公司
    companyChange(pkCorp) {
      // console.log(pkCorp)
      this.formData.departString = "";
      this.getDepart(pkCorp);
    },
    //点击保存
    handSave() {
      this.$refs.addForm.validate(valid => {
        if (valid) {
          var formData = this.formData;
          if (formData.id) {
            //编辑
            approvalEdit(formData).then(res => {
              this.$message({
                message: "成功",
                type: "success"
              });
              this.$emit("hideTotas");
            });
          } else {
            //新增approvalAdd
            approvalAdd(formData).then(res => {
              this.$message({
                message: "成功",
                type: "success"
              });
              this.$emit("hideTotas");
            });
          }
        }
      });
    },
    //获取账号列表
    getStaff() {
      userList({
        page: {
          page: 1,
          pageSize: 100000
        }
      }).then(res => {
        this.option = res.records;
      });
    },
    //获取部门列表
    getDepart(pkCorp) {
      omJobSelectBdDeptdoc({ pkCorp }).then(res => {
        this.departList = res;
      });
    },
    //页面初始化
    init() {
      // var sendData = this.sendFormData;
      // this.formData = {
      //   id: sendData.id || "",
      //   type: sendData.id ? sendData.type.toString() : "",
      //   sort: sendData.sort || "",
      //   cuserid: sendData.cuserid
      //     ? sendData.psnname + "," + sendData.cuserid
      //     : "",
      //   isInquiry: sendData.isInquiry,
      //   pkCorp: sendData.pkCorp,
      // };
      // this.departString = sendData.pkDeptdoc
      //   ? sendData.pkDeptdoc + "," + sendData.deptname
      //   : "";
      // if (sendData.pkCorp) {
      //   this.getDepart(sendData.pkCorp);
      // }
      let sendData = this.sendFormData;
      if (sendData.id) {
        this.formData = Object.assign({}, sendData);
        this.formData.type = this.formData.type.toString();
        this.userSrting =
          sendData.psnname + "," + sendData.cuserid;
        this.companyDepartData = [sendData.groupId,sendData.corpTypeId,sendData.pkCorp,sendData.pkDeptdoc];
      }
      // let sendData = this.sendFormData;
      // for (let i in this.formData) {
      //   this.formData[i] = sendData[i] || '';
      // }
      console.log(this.formData);
    }
  },
  mounted() {
    this.getStaff();
    // this.getDepart();
    this.init();
    // this.getCompany();
  }
};
</script>

<style lang="less" scoped>
</style>
